<template>
  <view class="box">
    <u-tabs
      class="tabs"
      lineWidth="32"
      :list="list1"
      @click="click"
      :activeStyle="{
        color: '#444',
        fontWeight: 'bold',
        transform: 'scale(1.05)',
        'font-size': '32rpx',
      }"
      lineColor="#444444"
      item-width="166"
      :inactiveStyle="{
        color: '#888888',
        transform: 'scale(1)',
        'font-size': '32rpx',
      }"
      :current="currentIndex"
    ></u-tabs>

    <scroll-view
      scroll-y="true"
      :style="{
        height: scrollHeight + 'px',
      }"
    >
      <view style="width: 100%; height: 40rpx"> </view>
      <!-- <u-loading-page :loading="loading"></u-loading-page> -->
      <u-loading-icon
        :show="loading"
        style="margin-top: 150rpx"
      ></u-loading-icon>

      <u-empty
        style="margin-top: 320rpx"
        v-if="!list.length && !loading && currentIndex != 6"
        mode="search"
      >
      </u-empty>
      <!-- <template v-if="(!loading && list.length) || currentIndex == 6">
        <Fly v-if="currentIndex == 0" :list="list"></Fly>
        <inspirationTower v-if="currentIndex == 1" :list="list" :from="'daohangyi'"></inspirationTower>
        <poem v-if="currentIndex == 2" :list="list" :isInp="false"></poem>
        <wenIsland v-if="currentIndex == 3" :list="list"></wenIsland>
        <star-list v-if="currentIndex == 4" :list="{ data: list }"></star-list>
        <log-list v-if="currentIndex == 5" :list="list" color1="rgb(68, 68, 68)"></log-list>
        <search-co v-if="currentIndex == 6" :search="search"></search-co>
        <character-log v-if="currentIndex == 7" :list="list" :search="search" :type="0"></character-log>
        <aoyi-hall v-if="currentIndex == 8" :list="list"></aoyi-hall>
        <dachengzhidao v-if="currentIndex == 9" :list="list"></dachengzhidao>
        <navigatorS v-if="currentIndex == 10" :list="{ data: list }"></navigatorS>
        <books v-if="currentIndex == 11" :list="{ data: list }"></books>
        <training v-if="currentIndex == 12" :list="{ data: list }"></training>
      </template> -->

      <template v-if="(!loading && list.length) || currentIndex == 6">
        <aoyi-hall v-if="currentIndex == 0" :list="list"></aoyi-hall>
        <navigatorS v-if="currentIndex == 1" :list="{ data: list }"></navigatorS>
        <dachengzhidao v-if="currentIndex == 2" :list="list"></dachengzhidao>
        <character-log v-if="currentIndex == 3" :list="list" :search="search" :type="0"></character-log>
        <books v-if="currentIndex == 4" :list="{ data: list }"></books>
        <training v-if="currentIndex == 5" :list="{ data: list }"></training>
        <search-co v-if="currentIndex == 6" :search="search"></search-co>
        <star-list v-if="currentIndex == 7" :list="{ data: list }"></star-list>
        <log-list v-if="currentIndex == 8" :list="list" color1="rgb(68, 68, 68)"></log-list>
        <poem v-if="currentIndex == 9" :list="list" :isInp="false"></poem>
        <Fly v-if="currentIndex == 10" :list="list"></Fly>
        <inspirationTower v-if="currentIndex == 11" :list="list" :from="'daohangyi'"></inspirationTower>
        <wenIsland v-if="currentIndex == 12" :list="list"></wenIsland>
      </template>
    </scroll-view>
  </view>
</template>
<script>
import Fly from "@/components/search/Fly.vue"; //飞离洞
import inspirationTower from "@/components/search/InspirationTower.vue"; //灵感塔
import poem from "@/components/search/poem.vue"; //诗心园
import wenIsland from "@/components/search/wenIsland.vue"; //文心岛
import starList from "@/components/starList.vue"; //星河
import logList from "@/components/logList.vue"; //游记
import searchCo from "@/components/search_co.vue"; //共创
import characterLog from "@/components/characterLog.vue"; //人物志
import aoyiHall from "@/components/aoyiHall.vue"; //奥义堂
import dachengzhidao from "@/components/dachengzhidao.vue"; //大成之道
import navigatorS from "@/components/navigatorS.vue"; //导航仪
import books from "@/components/books.vue"; //图书
import training from "@/components/training.vue"; //训练营(打卡)
import { Search } from "@/common/api/search.js";
export default {
  props: ["headHeight", "search"],
  components: {
    Fly,
    inspirationTower,
    starList,
    logList,
    searchCo,
    characterLog,
    aoyiHall,
    dachengzhidao,
    navigatorS,
    books,
    training,
    poem,
    wenIsland,
  },
  data() {
    return {
      // list1: [
      //   {
      //     name: "飞离洞",
      //   },
      //   {
      //     name: "灵感塔",
      //   },
      //   {
      //     name: "诗心园",
      //   },
      //   {
      //     name: "文心岛",
      //   },
      //   {
      //     name: "星河",
      //   },
      //   {
      //     name: "游记",
      //   },
      //   {
      //     name: "共创",
      //   },
      //   {
      //     name: "人物志",
      //   },
      //   {
      //     name: "奥义堂",
      //   },
      //   {
      //     name: "大成之道",
      //   },
      //   {
      //     name: "导航仪",
      //   },
      //   {
      //     name: "图书",
      //   },
      //   {
      //     name: "训练营",
      //   },
      // ],

      list1: [
        {
          name: "奥义堂",
        },
        {
          name: "导航仪",
        },
        {
          name: "大成之道",
        },
        {
          name: "人物",
        },
        {
          name: "图书",
        },
        {
          name: "训练营",
        },
        {
          name: "共创",
        },
        {
          name: "星河",
        },
        {
          name: "游记",
        },
        {
          name: "诗心园",
        },
        {
          name: "飞离洞",
        },
        {
          name: "灵感塔",
        },
        {
          name: "文心岛",
        },
      ],
      currentIndex: -1,
      scrollHeight: 0,
      show: false,
      list: [],
      loading: false,
    };
  },
  mounted() {
    console.log("searchssss", this.search);
    const statusBarHeight = uni.getSystemInfoSync().windowHeight; // 获取手机状态栏高度
    this.$nextTick(() => {
      uni
        .createSelectorQuery()
        .select(".tabs")
        .boundingClientRect((data) => {
          console.log("datadata", data.height, statusBarHeight);
          console.log("scrollHeight", this.scrollHeight);
          this.scrollHeight =
            statusBarHeight - (data.height + this.headHeight) - 100;
        })
        .exec();
    });
  },
  methods: {
    open() {
      this.show = true;
      if (this.currentIndex == -1) {
        this.currentIndex = 0;
      }

      this.getList();
    },
    async getList() {
      this.loading = true;
      try {
        const res = await Search({
          type: this.currentIndex + 1,
          content: this.search,
        });
        this.list = res.data.list.data;
        this.loading = false;
        console.log("ressssss", res);
      } catch {
        this.loading = false;
      }
    },
    click(e) {
      console.log("1111", e);
      this.currentIndex = e.index;
      this.getList();
    },
  },
};
</script>

<style lang="scss" scoped>
.box {
  width: 100%;
}
</style>
